<template>
  <div class="container">
    <div class="label">
      <el-button-group>
        <el-button size="medium" :type="btn_status === true ? 'info' : '' " @click="btn_status = true">新歌速递</el-button>
        <el-button size="medium" :type="btn_status === false ? 'info' : '' " @click="btn_status = false">新碟上架</el-button>
      </el-button-group>
    </div>
    <div v-show="btn_status">
      <NewSong></NewSong>
    </div>
    <div v-show="!btn_status">
      <NewAlbum></NewAlbum>
    </div>
  </div>
</template>

<script>
import NewSong from './NewSong.vue'
import NewAlbum from './NewAlbum.vue'
export default {
  components: {
    NewSong,
    NewAlbum
  },
  data () {
    return {
      btn_status: true
    }
  },
  methods: {},
  created () {}
}
</script>

<style lang="less" scoped>
  .container {
    width: 95%;
    margin: 20px auto;
    .label {
      .el-button {
        padding: 10px 35px;
      }
    }
  }
</style>
